<template>
  <div class="singer-wrap">
    <div class="mbx">
      <div>我的位置 > 歌手 > 周杰伦</div>
    </div>
    <div class="top">
      <img src="../images/20220714130853543.jpg" alt="" />
      <div class="intro">
        <div class="singerName">周杰伦</div>
        <p>
          周杰伦（Jay
          Chou），1979年1月18日出生于台湾省新北市，中国台湾流行乐男歌手、音乐人、演员、导演、编剧、监制、商人。
          2000年发行首张个人专辑《Jay》。
          2001年发行的专辑《范特西》奠定其融合中西方音乐的风格。 2002年举行“The
          One”世界巡回演唱会。2003年成为美国《时代周刊》封面人物。
          2003年2月，成为美国《时代周刊》亚洲版的封面人物；7月16日，周杰伦专辑《叶惠美》中的主打歌曲《以父之名》在超过50家电台首播，并有8亿人收听，而主打歌首播的当日也被这些电台定为“周杰伦日”；7月31日，发行专辑《叶惠美》，专辑主打歌曲《东风破》是周杰伦具有代表性的中国风作品之一，而他亦凭借这首歌曲获得第四届华语音乐传媒大奖最佳作曲人奖；11月，发行EP《寻找周杰伦》；12月12日，在上海体育场举办“THE
          ONE”演唱会，并演唱了变奏版的《双截棍》、加长版的《爷爷泡的茶》等歌曲；同年，出演电影处女作《寻找周杰伦》。
          2004年获得世界音乐大奖中国区最畅销艺人奖。
          2005年凭借动作片《头文字D》获得台湾电影金马奖、香港电影金像奖最佳新人奖。
          2006年起连续三年获得世界音乐大奖中国区最畅销艺人奖。
          2007年自编自导的文艺片《不能说的秘密》获得台湾电影金马奖年度台湾杰出电影奖。
          2008年凭借歌曲《青花瓷》获得第19届金曲奖最佳作曲人奖。同年，捐款援建希望小学。
          2009年入选美国CNN评出的“25位亚洲最具影响力的人物”；同年凭借专辑《魔杰座》获得第20届金曲奖最佳国语男歌手奖。
          2010年入选美国《Fast Company》评出的“全球百大创意人物”。
          2011年凭借专辑《跨时代》再度获得金曲奖最佳国语男歌手奖，并且第4次获得金曲奖最佳国语专辑奖；同年主演好莱坞电影《青蜂侠》。
          2012年登福布斯中国名人榜榜首。
          2013年5月22日，入围第24届台湾金曲奖最佳国语专辑奖、最佳国语男歌手、最佳专辑制作人奖；7月11日，自导自演的爱情片《天台爱情》上映，该片还被选为纽约亚洲电影节闭幕影片。
          2014年发行华语乐坛首张数字音乐专辑《哎呦，不错哦》。同年，担任中国禁毒宣传形象大使。
          2015年4月，在第19届全球华语榜中榜暨亚洲影响力大典中，获得亚洲影响力最受欢迎全能华语艺人奖、华语乐坛跨时代实力唱作人奖；5月，在福布斯中国名人榜中排名第2位；6月27日，凭借专辑《哎呦，不错哦》获得第26届台湾金曲奖最佳国语专辑、最佳专辑制作人两项提名。
          2016年发行专辑《周杰伦的床边故事》。
          2017年1月6日，周杰伦监制的爱情电影《一万公里的约定》在中国内地上映；8月9日，其发行的专辑《周杰伦的床边故事》获得华语金曲奖“年度最佳国语专辑”奖。
          2018年举行“地表最强2世界巡回演唱会”。
          2019年2月9日，在美国拉斯维加斯举行个人演唱会；9月16日晚11点，发行单曲《说好不哭》，该歌曲由方文山作词，周杰伦、陈信宏共同演唱；12月11日，周杰伦为电影《天火》献唱主题曲《我是如此相信》。
          2020年2月24日，由周杰伦作曲、方文山作词、张学友演唱的抗击疫情公益歌曲《等风雨经过》发布；5月11日，参与由人民日报客户端、国家人文历史等联合发起的“致敬白衣天使”线上音乐会。6月，发行单曲《MOJITO》。10月，监制并特别出演赛车题材电影《叱咤风云》。
          2021年，监制并出演的电影《叱咤风云》在中国内地上映；同年，参加央视春节联欢晚会，演唱歌曲《莫吉托》。同年5月12日，凭借《莫吉托》入围第32届金曲奖最佳单曲制作人奖。
          2022年5月20日，播出周杰伦摩天轮2013演唱会视频，曲目方面包括《龙拳》《一路向北》《不能说的秘密》《双截棍》等23首经典歌曲。同时，5月20日、21日在酷狗音乐、微信视频号等平台播出周杰伦“奇迹现场重映计划”线上视频演唱会。7月5日，专辑《最伟大的作品》开启预售预约。7月6日中午12时，周杰伦新专《最伟大的作品》先行曲MV上线。7月8日零时，周杰伦第15张专辑《最伟大的作品》开启预售。8小时时间里，周杰伦在多音乐平台就卖出上百万张专辑。7月15日，发行专辑《最伟大的作品》。
        </p>
      </div>
    </div>
    <div class="middle">
      <div>单曲</div>
      <div>专辑</div>
      <div>MV</div>
    </div>
    <div class="content">
      <ul>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">01</span>
              <span class="songName">晴天</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">02</span>
              <span class="songName">夜曲</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">03</span>
              <span class="songName">发如雪</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">04</span>
              <span class="songName">七里香</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">05</span>
              <span class="songName">听妈妈的话</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">06</span>
              <span class="songName">反方向的种</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">07</span>
              <span class="songName">龙战骑士</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">08</span>
              <span class="songName">惊叹号</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
        <li>
          <a href="#" hidefocus="true">
            <div class="song">
              <span class="index">09</span>
              <span class="songName">可爱女人</span>
            </div>
            <div class="icon">
              <span class="iconfont icon-erji"></span>
              <span class="iconfont icon-fenxiang"></span>
            </div>
          </a>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: "SingerIntroduce",
};
</script>

<style lang="less" scoped>
.singer-wrap {
  width: 1000px;
  margin: 20px auto;
  zoom: 1;
}
.mbx {
  margin: 10px 0;
}
.top {
  display: flex;
  border: 1px solid black;
}
.top img {
  width: 142px;
  height: 142px;
}
.intro {
  width: 782px;
}
.intro p {
  margin: 15px 35px;
  text-align: justify;
  line-height: 18px;
  padding-top: 15px;
  padding-right: 15px;
  height: 55px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.singerName {
  font-size: 16px;
  color: #393939;
  font-weight: 700;
  margin-top: 15px;
  margin-left: 35px;
}
.middle {
  margin: 20px auto 10px;
  padding-bottom: 5px;
  display: flex;
  justify-content: left;
  border-bottom: 2px solid #c2c2c2;
}
.middle div {
  margin-top: 10px;
  margin-left: 10px;
  margin-right: 200px;
  font-size: 12px;
  color: #000;
}
.content ul li a {
  display: flex;
  justify-content: space-between;
}
.content ul li a span {
  color: #000;

  margin-left: 10px;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  font-size: 12px;
}
.content ul li a .songName {
  margin-left: 25px;
  width: 320px;
}
.content ul li a .iconfont {
  margin-right: 20px;
  font-size: 14px;
}
</style>
